<template>
    <div class="head"> <img src="https://img.axureshop.com/ee/00/de/ee00de2201bf478bb4a9d4f881afd706/images/考勤签到/u746.png"
            @click="returnPage" />
        <span
            style="font-size: 20px;font-family: '微软雅黑 Regular';font-weight: bold; margin-left: 5px;margin-right: 190px;">{{title}}</span>
        <span style="font-size: 14px;font-family:'微软雅黑 Regular' ;font-weight: bold;" @click="addText">保存</span>
    </div>

    <van-form @submit="addText" ref="addTextFormRef">
        <van-cell-group inset>
            <span style="font-size: 15px; font-family:'微软雅黑 Regular' ;font-weight: bold;margin-bottom: 5px;">新闻主标题</span>
            <van-field v-model="textForm.title" placeholder="请输入新闻标题" name="title"
                :rules="[{ validator, message: '新闻标题必须填写' }]" />

                <span style="font-size: 15px; font-family:'微软雅黑 Regular' ;font-weight: bold;margin-bottom: 5px;">新闻副标题</span>
            <van-field v-model="textForm.title" placeholder="请输入新闻标题（非必填）" name="othertitle"
                :rules="[{ validator, message: '新闻标题必须填写' }]" />

            <span style="font-size: 15px;margin-top: 10px; font-family:'微软雅黑 Regular' ;font-weight: bold;">新闻详情</span>

            <van-field v-model="textForm.massage" type="text" name="massage" :rules="[{ validator, message: '新闻详情必须填写' }]"
                autosize style="height:230px;" placeholder="请输入新闻详情" />
        </van-cell-group>


        <van-field name="switch" label="定时发布" class="switch">
            <template #input>
                <van-switch v-model="checked" />
            </template>
        </van-field>

        <van-field name="switch" label="推送到班级">
            <template #input>
                <van-switch v-model="checked2" class="switch" />
            </template>
        </van-field>

    </van-form>
</template>


<script setup >
import { computed, reactive } from "vue";
import { useRoute, useRouter } from "vue-router";
import { addTextApi } from "../../api/application"
import { showDialog, closeDialog } from 'vant';
import { ref } from 'vue'
const router = useRouter()
const textForm = reactive({
    title: '',
    massage: ''
})
const route=useRoute()
const title=computed(()=>{
    return route.query.title
})

const validator = (val) => val.length > 0;
const returnPage = () => {
    router.replace('/schoolMessage')
}
const addTextFormRef = ref()
const checked = ref(true);
const checked2 = ref(false);
const addText = async () => {
    let ret = await addTextApi(textForm);
    if (ret.code === 0) {

        showDialog({
            closeOnClickOverlay: true,
            showConfirmButton: false,
            message: "保存成功"
        })
        setTimeout(() => {
            closeDialog();
            router.replace('schoolMessage')

        }, 2000);
    }
};
</script>


<style lang='scss' scoped>
.head {
    display: flex;
    height: 40px;
    align-items: center;
    margin-top: 10px;
    padding-left: 5px;
    margin-bottom: 20px;
}

.van-dialog {
    height: 10px;
    color: green;
}

.van-cell__value {
    display: flex;
    justify-content: right;
}

.van-cell {
    margin-top: 10px;
    margin-bottom: 10px;

}

// .van-field__control--custom{
// }
</style>